<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/flexible.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			body,ul,li,h1,h2,h3,h4,p,dl,dd,dt,ol{
			margin: 0;
			padding: 0;
		}
		ul,li,ol{
			list-style: none;
		}
		a{
			text-decoration: none;
		}
		.app{
			
			background-color: #efefef;
		}
		.header{
			
			height: 1.4375rem;
			background: #f9fafd;
			color: #000000;
			font-size: 0.5rem;
			text-align: center;
			line-height: 1.3rem;
			position: fixed;
			top: 0;
			right: 0;
			left: 0;
			z-index: 10;
		}
		
		.section{
			
			height: 12.765625rem;
			position: absolute;
			top: 0rem;
			bottom: 0rem;
			left: 0;
			right: 0;
			/*overflow-y: scroll;*/
		}
		.footer{
			height: 1.578125rem;
			background: #f2f2f2;
			color:#fff;
			font-size: 0.5rem;
			text-align: center;
			line-height: 1.3rem;
			position: fixed;
			bottom: 0;
			right: 0;
			left: 0;
			display: flex;
			flex-wrap: wrap;
			
		}
		.footer div{
			margin-top: .1rem;
			width: 1.96875rem;
			height: 0.765625rem;
			justify-content:center;
			display: flex;
		}
		.footer div img{
			height: .753125rem;
		}
		.footer div span{
			color: gray;
			font-size: 0.375rem;
			position: absolute;
			/*margin-left: -.35rem;*/
			top: .5rem;
			
		}
		.zb{
			height: 1.515625rem;
			line-height: 1.515625rem;
			margin-left: 0.46875rem;
			font-size: 0.421875rem;
			color: red;
		}
		.kuai{
			height: 0.3125rem;
			background-color: #efefef;
		}
		.shan{
			height: 1.75rem;
			/*background-color: grey;*/
		}
		.shan ul{
			
		}
		.shan ul li img{
			height: 0.390625rem;
			
		}
		.shan ul li{
			margin-top: 0.21875rem;
			float: left;
			margin-left: 0.40625rem;
			color: #c3c3c3;
			font-size: 0.375rem;
		}
		.shan p{
			margin-left: 0.40625rem;
			color: #c3c3c3;
			font-size: 0.3125rem;
			position: absolute;
			top: 4.2rem;
		}
		.kuaix{
			height: 0.03125rem;
			background-color: #efefef;
		}
		.time{
			height: 1.59375rem;
		}
		.time ul{
			display: flex;
			justify-content:space-around;
		}
		.time ul li{
			height: 1.59375rem;
			line-height: 1.59375rem;
			float: left;
			font-size: 0.40625rem;
		}
		.nm{
			height: 2.53125rem;
		}
		.nm ul li{
			height: 2.53125rem;
			line-height: 2.53125rem;
			float: left;
		}
		.quan{
			height: 1.578125rem;
		}
		.sheng{
			height: 5.90625rem;
			background-color: gainsboro;
		}
		</style>
	</head>
	<body>
		<div class="app">
			<div class="header">购物车</div>
			<div class="section">
				<div class="zb">
					鲜蜂侠需要您的精准坐标
				</div>
				<div class="kuai"></div>
				<div class="shan">
					<ul>
						<li><img src="img/car_bg.png"/></li>
						<li>闪送超市</li>
					</ul>
					<p>￥0送起，22:00前满￥30减免运费，22:后满￥69减免运费</p>
				</div>
				<div class="kuaix"></div>
				<div class="time">
					<ul>
						<li>收货时间</li>
						<li style="color: red;">一小时送达</li>
						<li></li>
						<li>可预订 ></li>
					</ul>
				</div>
				<div class="kuaix"></div>
				<div class="nm">
					<ul>
						<li><img style="height: 0.546875rem;" src="img/dui.png"</li>
						<li><img style="height: 1.25rem;line-height: 2.53125rem;" src="img/wt.png"</li>
					</ul>
				</div>
				<div class="kuaix"></div>
				<div class="quan">
					
				</div>
				<div class="kuaix"></div>
				<div class="sheng"></div>
				
			</div>
			
			
			
			
			
			
			<div class="footer">
		    	
				<div>
					<img src="img/home.png" />
				</div>
				<div>
					<img src="img/foudre.png" />
				</div>
				<div>
					<img src="img/1.png" />
				</div>
				<div>
					<img src="img/shop.png" />
				</div>
				<div><img src="img/my.png" /></div>
				<div><span>首页</span></div>
				<div><span>闪送超市</span></div>
				<div><span>新鲜预定</span></div>
				<div><span>购物车</span></div>
				<div><span>我的</span></div>
			
		    </div>
		</div>
	</body>
</html>
